{% load static %}
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="renderer" content="webkit">
<title>登录页面</title>
<link rel="stylesheet" href="{% static '/public/css/ui.css' %}">
<link rel="stylesheet" href="{% static '/public/admin/css/layout.css' %}">
<script src="{% static '/public/js/jquery.js' %}"></script>
<script src="{% static '/public/js/ui.js' %}"></script>
</head>

<body class="bg-login">

    <div class="ui-login ui-am-scale-up">
        <div class="header">
        	<div class="logo"><a href="/"><span class="ui-icon-home"></span>返回首页</a><img src="{{ WEB_LOGO }}" height="40"></div>
        </div>
        <form class="ui-form" method="post">
			{% csrf_token %}
            <div class="ui-form-group">
        		<i class="ui-form-icon ui-icon-user"></i>
                <input type="text" name="adminname" tabindex="1" class="ui-form-ip" data-rule="用户名:required;username;" placeholder="请输入用户名" >
            </div>
            <div class="ui-form-group">
        		<i class="ui-form-icon ui-icon-lock"></i>
                <input type="password" name="adminpass" tabindex="2" class="ui-form-ip" placeholder="请输入密码" data-rule="密码:required;password;">
            </div>
            <div class="ui-form-group">
                <div class="ui-input-group">
                	<i class="ui-form-icon ui-icon-eye"></i>
                    <input type="text" name="captcha" id="code" class="ui-form-ip radius-right-none" placeholder="请输入验证码" data-rule="验证码:required;">
                    <input type="hidden" id="captcha_0" name="captcha_0" value="{{ hashkey }}">
					<span class="code"><img src="{{ image_url }}" id="verify" title="点击更换验证码" class="ui-tips" data-align="top"></span>
                </div>
            </div>
            <div class="ui-form-group">
                <input type="submit" value="登录" class="ui-btn ui-btn-block">
            </div>
        </form>
    </div>

<script>
$(function()
{
	$("#verify").click(function()
    {
    	$.get('/captcha/refresh/', function (data) {
            $('#captcha_0').attr('value', data.key);
            $('#verify').attr('src', data.image_url);
        });
    	$("#code").val("");
    });
	$("html,body").css({"display":"flex","align-items":"center","justify-content":"center","height":"100%"});
	$(".ui-form").form(
	{
		type:2,
		'align':"top-right",
		result:function(form)
		{
			$.ajax(
			{
				type:'post',
				cache:false,
				dataType:'json',
				url:'{% url "manager:login" %}',
				data:$(form).serialize(),
				error:function(e){alert(e.responseText);},
				success:function(d)
				{
					if(d.state=='success')
					{
						wmcms.success(d.msg);
						setTimeout(function(){location.href='{% url "manager:index" %}';},1500);
					}
					else
					{
						$("#verify").click()
						wmcms.error(d.msg);
					}
				}
			});
		}
	});
})
if(self!=top){top.location=self.location;}
</script>

</body>
</html>